<!--
 * @Author: 陈俊升 761723995@qq.com
 * @Date: 2023-11-07 09:43:46
 * @LastEditors: 陈俊升 761723995@qq.com
 * @LastEditTime: 2023-11-24 14:53:18
 * @FilePath: /hr_new_vue3/src/views/Management/Contract/BaseSetting/ContractTemplate/Components/AddTemplate/ContractBaseInfo.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<!-- 合同签署 -->
<template>
  <div class="index" v-if="formData.signData?.length > 0">
    <a-form
      :model="formData.signData[currIndex]"
      ref="refForm"
      :rules="rules"
      auto-label-width
    >
      <a-form-item label="合同确认截止日期" field="overTime" show-colon>
        <a-date-picker
          v-model="formData.signData[currIndex].overTime"
          style="width: 250px"
        />
      </a-form-item>
      <a-form-item label="确认截止日期未确认将视为" field="expire" show-colon>
        <a-radio-group v-model="formData.signData[currIndex].expire">
          <a-radio :value="1">默认通过</a-radio>
          <a-radio :value="2">不通过</a-radio>
        </a-radio-group>
      </a-form-item>
      <a-form-item label="合同签署有效时间" field="signature" show-colon>
        <a-date-picker
          v-model="formData.signData[currIndex].signature"
          style="width: 250px"
        />
      </a-form-item>
      <a-form-item label="" field="remind">
        签署有效期前
        <a-input-number
          v-model="formData.signData[currIndex].remind"
          style="width: 150px; margin: 0 10px"
          allow-clear
          hideButton
          button-text="Search"
          :min="1"
        >
          <template #append>
            <span>天</span>
          </template>
        </a-input-number>
        进行提醒
      </a-form-item>
    </a-form>
  </div>
</template>

<script setup lang="ts">
import { cloneDeep } from 'lodash';
import { PerformanceAppraisal } from '@/apis/management/performance/baseSetting/template/type';
import { GetGenerateContractNum } from '@/apis/management/contract/contractManagement/waitSigned';
import { useVModel } from '@vueuse/core';
const props = withDefaults(
  defineProps<{
    data: any;
  }>(),
  {}
);
const rules = reactive({
  // templateName: [
  //   {
  //     required: true,
  //     message: '请输入'
  //   },
  //   {
  //     // validator: validateName
  //   }
  // ],
  overTime: [
    {
      required: true,
      message: '请选择'
    }
  ],
  expire: [
    {
      required: true,
      message: '请选择'
    }
  ],
  signature: [
    {
      required: true,
      message: '请选择'
    }
  ],
  remind: [
    {
      required: true,
      message: '请选择'
    }
  ]
});

let itemRefs: any = {}; // 储存动态生成的富文本ref

const setItemRef = (el: any, index: number) => {
  for (let i = 0; i < formData.value.signData.length; i++) {
    itemRefs[i] = el;
  }
};

const emit = defineEmits(['update:data']);
const formData = useVModel(props, 'data', emit);

let userName = ref('');
let currIndex = ref(0);
let refForm = ref([]);

const createRef = () => {
  props.data.userData;
};

watch(
  () => props.data.userData,
  (newVal: any) => {
    if (newVal) {
      userName.value = formData.value.userData[0].name;
    }
  },
  {
    deep: true
  }
);

watch(
  () => props.data.signData,
  (newVal: any) => {
    if (newVal) {
      // let tempUserName = [];
      // formData.value.signData = [];
      // newVal.forEach((el: any, ind: number) => {
      //   tempUserName.push(el.name);
      //   formData.value.signData.push({
      //     contractName: `${el.name}的合同`, // 合同名称
      //     contractNum: '', // 合同编号
      //     way: 1, // 签署方式
      //     overTime: '', // 合同确认截止日期
      //     expire: 1, // 确认截止日期未确认将视为
      //     signature: '', // 合同签署有效时间
      //     remindTime: '', // 提醒时间
      //     remind: undefined // 有效期前几天开始提醒
      //   });
      // });
      // currIndex.value = 0;
      contractName.value = formData.value.signData[0].contractName;
    }
  },
  {
    deep: true
  }
);

const getContractNum = async (id: number, userId: number) => {
  try {
    const res = await GetGenerateContractNum({
      id,
      userId
    });
    return res;
  } catch (error: unknown) {
    console.log(error);
  }
};

watch(
  () => props.data.baseInfoData,
  async (newVal: any) => {
    if (newVal.templateId) {
      // for (let [i, index] of formData.value.userData) {
      //   const res = await getContractNum(newVal.templateTypeId, i.id);
      //   formData.value.signData[index].contractNum = res;
      // }
      // for (let i = 0; i < formData.value.userData.length; i++) {
      //   const res = await getContractNum(
      //     newVal.templateTypeId,
      //     formData.value.userData[i].id
      //   );
      //   formData.value.signData[i].contractNum = res;
      // }
    }
  },
  {
    deep: true
  }
);

let contractName = ref('');
const changeContractName = (val: string) => {
  nextTick(() => {
    for (let i = 0; i < formData.value.signData.length; i++) {
      if (formData.value.signData[i].contractName === val) {
        currIndex.value = i;
        break;
      }
    }
  });
};

const validate = async () => {
  for (let i = 0; i < formData.value.signData.length; i++) {
    console.log('====================================iiii');
    console.log(i);
    console.log(await itemRefs[i].validate());
    console.log(await itemRefs[i]);
    console.log('====================================');
    if (await itemRefs[i].validate()) {
      return await itemRefs[i].validate();
    }
  }
  // const check = await refForm.value.validate();
  return undefined;
};
defineExpose({ validate });
</script>

<style lang="less" scoped>
.index {
  width: 800px;
  margin: 0 auto;
}
:deep(.arco-input-append) {
  background-color: #eee;
}
</style>
